{% extends 'base.html' %}
{% block main %}
<nav class="navbar navbar-default" role="navigation">


				<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
					<ul class="nav navbar-nav">
						<li class="type">
							 <a href="/?food_type=新品上市"><span class="glyphicon glyphicon-fire"></span>&nbsp;新品上市</a>
						</li>
                        <li class="type">
							 <a href="/?food_type=凉菜">凉菜</a>
						</li>
						<li class="type">
							 <a href="/?food_type=热菜">热菜</a>
						</li>
                        <li class="type">
							 <a href="/?food_type=主食">主食</a>
						</li>
                        <li class="type">
							 <a href="/?food_type=饮品">饮品</a>
						</li>

					</ul>
					<form class="navbar-form navbar-left pull-right" role="search"  action="/" method="post">
						<div class="form-group">
							<input name="mohu" type="text" class="form-control" placeholder="意面蔬果简餐" />
						</div> <button type="submit" class="btn btn-default">搜美食</button>
					</form>

				</div>

			</nav>
			<div class="row">
                {% for foo in food_all %}
				<div class="col-md-4">
					<div class="thumbnail">
						<img alt="300x200" src="{{ foo.img }}" />
						<div class="caption">
							<h4>
								{{ foo.food_name }}
							</h4>
							<p>
								销量:{{ foo.food_sold }}份<br>
                                剩余数量:{{ foo.food_number }}份<br>
                                单价:<span style="color: red;font-size: 18px">{{ foo.food_money }}</span>元
							</p>
							<p>
                                {% if foo.food_number > 0 %}
								    <a class="btn btn-primary btn btn-danger" href="/order_update/?food_id={{ foo.id }}">加入购物车</a>
                                {% else %}
                                    <a class="btn btn-default" role="button">已售罄</a>
                                {% endif %}
							</p>
						</div>
					</div>

				</div>
                {% endfor %}
			</div>
			<ul class="pagination pull-right">
                {% if food_all.has_previous %}
                <li><a href="/?page={{ food_all.previous_page_number }}">上一页</a></li>
                {% else %}
                    <li><a href="">上一页</a></li>
                {% endif %}
                {% for i in food_all.paginator.page_range %}
{#              判断是否为当前页,如果是当前页则普通展示并加粗#}
                {% if i == food_all.number %}
                <li class="active"><a href="#">{{ i }}</a></li>
{#              如果不是当前页则附带超链接展示#}
                {% else %}
{#              超链接用于点击某一页页码时候将页码传到后台#}
                <li><a href="/?page={{ i }}">{{ i }}</a></li>
                {% endif %}
                {% endfor %}
                {% if food_all.has_next %}
                <li><a href="/?page={{ food_all.next_page_number }}">下一页</a></li>
                {% else %}
                <li><a href="">下一页</a></li>
    {% endif %}
			</ul>



{% endblock main %}